<template>
    <el-container>
        <el-header class="sa-header">
            <div class="sa-title sa-flex sa-row-between">
                <div class="label sa-flex">
                    <span class="left"> 供应商管理</span>

                    <search-condition :conditionLabel="filterParams.conditionLabel"
                        @deleteFilter="deleteFilter"></search-condition>
                </div>
                <div>
                    <!-- <el-button class="sa-button-add" @click="bathAssagn">批量指派</el-button>
            <el-button class="sa-button-refresh" icon="RefreshRight" @click="getData()"></el-button> -->
                    <el-button class="sa-button-refresh" icon="Search" @click="openFilter"></el-button>
                </div>
            </div>
        </el-header>
        <el-main class="sa-p-0" v-loading="table.loading">
            <el-table ref="multipleTableRef" class="sa-table" height="100%" :data="table.data" stripe row-key="id">
                <template #empty>
                    <sa-empty />
                </template>
                <el-table-column prop="id" label="供应商ID" min-width="80" align="center" />
                <el-table-column prop="sign_name" label="供应商名称" min-width="180" align="center" show-overflow-tooltip />

                <el-table-column prop="title" label="订单量" min-width="180" align="center" show-overflow-tooltip />
                <el-table-column prop="individual_json[0]" label="未完结订单" min-width="200" align="center"
                    show-overflow-tooltip />
                <el-table-column prop="name" label="退款订单" min-width="180" align="center" show-overflow-tooltip />
                <el-table-column prop="mobile" label="销售金额" min-width="180" align="center" show-overflow-tooltip />
                <el-table-column prop="id_card" label="退款金额" min-width="180" align="center" show-overflow-tooltip />
                <el-table-column prop="order_amount" label="供应商品数" min-width="180" align="center"
                    show-overflow-tooltip />
                <el-table-column prop="nickname" label="已选商品数" min-width="180" align="center" show-overflow-tooltip />
                <el-table-column prop="nickname" label="出售中商品数" min-width="180" align="center" show-overflow-tooltip />
                <el-table-column prop="create_time" label="创建时间" min-width="180" align="center" show-overflow-tooltip />
                <el-table-column label="状态" min-width="160" align="center">
                    <template #default="scope">
                        <el-tag type="success" v-if="scope.row.status === 2">{{
                            scope.row.status_name
                            }}
                        </el-tag>
                        <el-tag type="primary" v-if="scope.row.status === -1">{{
                            scope.row.status_name
                            }}
                        </el-tag>
                        <el-tag type="warning" v-if="scope.row.status === 3">{{
                            scope.row.status_name
                            }}
                        </el-tag>
                        <el-tag type="info" v-if="scope.row.status === 4">{{ scope.row.status_name }}</el-tag>
                        <el-tag type="danger" v-if="scope.row.status === 0 || scope.row.status === 5">{{
                            scope.row.status_name
                            }}</el-tag>
                    </template>
                </el-table-column>

                <el-table-column fixed="right" label="操作" min-width="240">
                    <template #default="scope">
                        <el-button type="primary" class="is-link" v-auth="'taxation.admin.industry.license.edit'"
                            @click="edit(scope.row)" v-if="scope.row.status !== -1 && scope.row.status !== 5">查看
                        </el-button>
                        <el-button type="primary" class="is-link" v-auth="'taxation.admin.industry.license.task'"
                            v-if="scope.row.bind_status === 0 && scope.row.status !== 5 && scope.row.assign_status === 1"
                            @click="assignTask(scope.row)">指派任务
                        </el-button>
                        <el-button type="primary" class="is-link" @click="checkInassagn(scope.row)"
                            v-auth="'taxation.admin.industry.license.addassagn'"
                            v-if="scope.row.assign_status !== 1 && scope.row.status !== 5">指派服务商
                        </el-button>
                    </template>
                </el-table-column>
            </el-table>
        </el-main>
        <sa-view-bar>
            <template #right>
                <sa-pagination :pageData="pageData" @updateFn="getData" />
            </template>
        </sa-view-bar>
    </el-container>
    <el-dialog v-model="dialogVisible" title="选择服务商" width="500" :before-close="handleClose">
        <el-select v-model="value" filterable remote reserve-keyword placeholder="请选择指派的服务商" remote-show-suffix
            :remote-method="remoteMethod" :loading="loading" style="width: 466px; margin-top: 10px">
            <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
        </el-select>
        <template #footer>
            <div class="dialog-footer">
                <el-button @click="handleClose">取消</el-button>
                <el-button type="primary" @click="sureCheckin"> 确认</el-button>
            </div>
        </template>
    </el-dialog>
</template>
<script>
export default {
    name: 'supplychian.admin.supply.index',
};
</script>

<script setup>
import { onMounted, reactive, ref, computed } from 'vue';
import { usePagination, useModal } from '@/sheep/hooks';
import { api } from '../supply.service';
import { useSearch } from '@/sheep/components/sa-table/sa-search/useSearch';
import { cloneDeep } from 'lodash';
import { ElMessage } from 'element-plus';
import $storage from '@/sheep/utils/storage';


const show = computed(() => {
    return !$storage.get('lastLogin').info.merchant_id;
});
const value = ref('');
const options = ref([]);
const loading = ref(false);
const dialogVisible = ref(false);
const table = reactive({
    loading: false,
    data: [],
});
const filterParams = reactive({
    tools: {

        handle_name: {
            type: 'tinput',
            label: '供应商ID/供应商名称',
            field: 'handle_name',
            value: '',
        },
        status: {
            type: 'tselect',
            label: '请选择供应商',
            field: 'status',
            multiple: true,
            value: [],
            options: {
                data: [
                    {
                        label: '全部',
                        value: '',
                    },
                    {
                        label: '待提交',
                        value: '-1',
                    },
                    {
                        label: '已退回',
                        value: '0',
                    },
                    {
                        label: '待办理',
                        value: '2',
                    },
                    {
                        label: '办理中',
                        value: '3',
                    },
                    {
                        label: '已完结',
                        value: '4',
                    },
                    {
                        label: '已退款',
                        value: '5',
                    },
                ],
            },
        },

    },
    data: {
        handle_name: '',
        status: [],


    },
    conditionLabel: {},
});
const { openFilter, deleteFilter } = useSearch({ filterParams, getData });

const { pageData } = usePagination();

const handleClose = () => {
    dialogVisible.value = false;
    value.value = '';
    idarr.value = []
};


async function getData(page) {
    table.loading = true;
    if (page) pageData.page = page;
    let tempSearch = cloneDeep(filterParams.data);
    const { error, data } = await api.supplyList({
        page: pageData.page,
        list_rows: pageData.list_rows,
        mobile: tempSearch.mobile,
        status: tempSearch.status.join(','),
        handle_name: tempSearch.handle_name,
    });
    table.loading = false;
    if (error === 0) {
        table.data = data.data;
        pageData.page = data.current_page;
        pageData.list_rows = data.per_page;
        pageData.total = data.total;
    }
}

onMounted(() => {
    if ($storage.get('lastLogin').info.merchant_id) {
        delete filterParams.tools.assign_status;
    }
    getData();
});
</script>
<style></style>